<template>
  <div class="main-container">
    <div>
      <button @click="onClick('store')">千店图</button>
      <button @click="onClick('heat')">热力图</button>
    </div>
    <component :is="currentComponent" />
  </div>
</template>
<script setup>
import { onMounted, ref } from "vue";
import mapStore from "./components/map-store.vue";
import mapHeat from "./components/map-heat.vue";

const currentComponent = ref(mapStore);

const onClick = (val) => {
  if (val === "store") {
    currentComponent.value = mapStore;
  } else {
    currentComponent.value = mapHeat;
  }
};
onMounted(async () => {});
</script>
<style lang="less" scoped></style>
